import Vue from 'vue'
import Vuex from 'vuex'
// 导入持久化插件
import createPersistedState from 'vuex-persistedstate'

Vue.use(Vuex)
// vuex 刷新项目 会初始化成最初的值
//1. 手动存储localstorge
// 2.安装vuex持久化插件
//npm i vuex-persistedstate --save 


export default new Vuex.Store({
  state: {//设计的公共状态
      tokenId:"",//存储登录后返回的token
      menuCol:4, //菜单的占比
      viewCol:20,// 视口的占比
      powerCode:0,//当前用户的权限编码 2 系统管理员 1 课程管理员
      breadArr:[]//面包屑导航的数据
  },
  mutations: { //同步改变的state的方法
    setToken(state,token){
        state.tokenId=token;
    },
    setCol(state,ColObj){ //改变layout菜单和视口的占比
      
    state.menuCol=ColObj.menuCol;
    state.viewCol=ColObj.viewCol;
    },
    setPower(state,power){ //改变当前用户的权限编码
      state.powerCode=power;
    },
    setBread(state,arr){ //改变面包屑导航数据的方法
      state.breadArr=arr;
    }
  },
  actions: { //异步改变state的方法
    tokenAction({commit},token){
      commit("setToken",token)
    }
  },
  getters:{
      tokenId:state=>state.tokenId,
      menuCol:state=>state.menuCol,
      viewCol:state=>state.viewCol,
      powerCode:state=>state.powerCode
  },
  modules: {
  },
  // 配置持久化插件
  plugins:[createPersistedState()]
})
